<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<jsp:include page="../pageheader.jsp"/>

<div id="mainInfo" class="container">
    <div class="panel panel-info">
        <div class="panel-heading">
            Description
        </div>
        <div class="panel-body">
            ${trip.getDescription()}
        </div>
        <div class="panel-footer">
            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>Departure</th>
                        <th>Arrival</th>
                        <th>Departure Date</th>
                        <th>Arrival Date</th>
                        <th>Vehicle</th>
                    </tr>
                </thead>
                <tbody>
                    <c:if test="${trip != null}">
                        <tr>
                            <td>${trip.getDeparture().getAddress()}</td>
                            <td>${trip.getDestination().getAddress()}</td>
                            <td>${trip.getDepartueEstimatedDate()}</td>
                            <td>${trip.getArrivalEstimatedDate()}</td>
                            <td>
                                <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#vehicle_modal">
                                    ${trip.getVehicle().getBrand()}
                                </button>
                                <div class="modal fade" id="vehicle_modal" tabindex="-1" role="dialog" aria-labelledby="vehicle_modal_label" aria-hidden="true">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title" id="vehicle_modal_label">Vehicle Info</h4>
                                            </div>
                                            <div class="modal-body">
                                                Brand: ${trip.getVehicle().getBrand()}
                                                <br/>
                                                Seats: ${trip.getVehicle().getSeats()}
                                                <br/>
                                                Year of make: ${trip.getVehicle().getYear()}
                                                <br/>
                                                License Plate: ${trip.getVehicle().getPlateNumber()}
                                                <br/>
                                                Cleanliness: ${trip.getVehicle().getVehicleProfile().getCleanlinessAverage()}
                                                <br/>
                                                Safety: ${trip.getVehicle().getVehicleProfile().getSafetyAverage()}
                                                <br/>
                                                Conservation: ${trip.getVehicle().getVehicleProfile().getConservationAverage()}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    </c:if>
                </tbody>
            </table>
        </div>
    </div>
    <div id="mainInfoParticipants" class="row">
        <c:if test="${trip.getParticipations() != null}">
            <c:forEach items="${trip.getParticipations()}" var="participants">
                <div class="well well-lg">
                    <div class="row">
                        <div class="col-xs-5">
                            ${participants.getUser().getName()}
                        </div>
                        <div class="col-xs-5">
                            ${participants.getUser().getEmail()}
                        </div>
                        <c:if test="${car.getUser().getId() == participants.getUser().getId()}">
                            <div class="col-xs-2">
                                <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapse_driver_profile_${participants.getUser().getId()}" aria-expanded="false" aria-controls="collapse_driver_profile_${participants.getUser().getId()}">
                                    <i class="fa fa-info"></i>
                                </button>
                            </div>
                            <div class="collapse" id="collapse_driver_profile_${participants.getUser().getId()}">
                                Courtesy: ${participants.getUser().getDriverProfile().getCourtesyAverage()}
                                <br />
                                Punctuality: ${participants.getUser().getDriverProfile().getPunctualityAverage()}
                                <br />
                                Drives Carefully: ${participants.getUser().getDriverProfile().getDriveCarefullyAverage()}
                            </div>
                        </c:if>
                        <c:if test="${car.getUser().getId() != participants.getUser().getId()}">
                            <div class="col-xs-2">
                                <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapse_passenger_profile_${participants.getUser().getId()}" aria-expanded="false" aria-controls="collapse_passenger_profile_${participants.getUser().getId()}">
                                    <i class="fa fa-info"></i>
                                </button>
                            </div>
                            <div class="collapse" id="collapse_passenger_profile_${participants.getUser().getId()}">
                                Good Humored: ${participants.getUser().getPassengerProfile().getGoodHumoredAverage()}
                                <br />
                                Punctuality: ${participants.getUser().getPassengerProfile().getPunctualityAverage()}
                            </div>
                            <c:if test="${car.getUser().getId() == loggedUser.getId() && !participants.getAccepted() && !trip.isEnded()}">
                                <button id="accept_participant_button" class="btn btn-info" onclick="onClickAcceptParticipant('${trip.getId()}', '${participants.getUser().getId()}')">Accept</button>
                            </c:if>
                        </c:if>
                    </div>
                </div>
            </c:forEach>
        </c:if>
    </div>
    <c:if test="${loggedUser != null && !trip.isEnded()}">
        <div class="row">
            <div class="col-md-2">
                <c:if test="${!trip.userInTrip(loggedUser)}">
                    <input id="applyForTrip" class="btn btn-primary" value="Apply" onclick="onClickApplyForTrip('${trip.getId()}')" />
                </c:if>
            </div>
        </div>
    </c:if>
</div>

<jsp:include page="../pagefooter.jsp"/>